<link rel="stylesheet" type="text/css" href="css/ng-tags-input.min.css">
<link rel="stylesheet" type="text/css" href="css/ng-tags-input.bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/bootstrap.vertical-tabs.min.css">
<link rel="stylesheet" type="text/css" href="css/angular-toggle-switch.css">
<div class="content-wrapper">
	<div ng-show="root.twitterSession" class="container-fluid content-container container">

	<div id="my-connection-panel">
		<div class="buttonPanel pull-right">
			<button class="btn btn-loklak-blue btn-lg" data-toggle="modal" data-target="#add-connection-modal" ng-click="clearModalData()">Add Source</button>
		</div>
		<h1>My Data</h1> <button id="refreshButton" class="btn btn-default" ng-click="onUpdateDataSources()" title="Refresh"><i class="fa fa-refresh"></i></button>
		<div connect-alert messages="dataSourceMessages" set-message-view="setMessageView(profile)"></div>
		<hr/>
		<ul id="datasource-table">
		<li>
			<div class="row title-row">
				<div class="col col-md-3">Source URL</div>
				<div class="col col-md-2">Source type</div>
				<div class="col col-md-2">Created at</div>
				<div class="col col-md-2">Last edit</div>
				<div class="col col-md-1">Item</div>
				<div class="col col-md-1">Map</div>
				<div class="col col-md-1">Shared by</div>
			</div>
		</li>
		<li ng-repeat="item in dataSourceItems" ng-click="showRowDetail($event)">
			<div class="row content-row">
				<div class="col col-sm-3 col-md-3 col-source-url"><a ng-href="{{item.source_url}}" target="_blank">{{item.source_url}}</a></div>
				<div class="col col-md-2"><a ng-href="/connect/{{item.source_type}}" ng-click="$event.stopPropagation();">{{item.display_source_type}}</a></div>
				<div class="col col-md-2" am-time-ago="item.created_at"></div>
				<div class="col col-md-2" am-time-ago="item.last_modified"></div>
				<div class="col col-md-1"><a data-toggle="modal" data-target="#message-view-modal" ng-click="setMessageView(item)">File <span class="badge">{{item.imported.length}}</span></a></div>
				<div class="col col-md-1"><a data-toggle="modal" data-target="#map-view-modal" ng-click="setMapView(item)">View</a></div>
				<div class="col col-md-1">{{item.sharers | arraySize}}</div>
			</div>
			<div class="detail" ng-click="$event.stopPropagation();">
				<div class="row">
					<div class="col-md-2">
						<label for="harvesting_freq">Update frequency</label>
					</div>
					<div class="col-md-10">
						<select name="harvesting_freq" type="text" ng-disabled="!item.editing" ng-options="freq.value as freq.label for freq in harvestingFreqList" ng-model="item.harvesting_freq"/>
					</div>
				</div>
				<div class="row">
					<div class="col-md-2">
						<label for="lifetime">Lifetime</label>
					</div>
					<div class="col-md-10">
						<input name="lifetime" datasource-lifetime type="text" ng-disabled="!item.editing" ng-model="item.lifetime"/>
					</div>
				</div>
				<div class="row detailButtonPanel">
					<div class="col-md-12">
						<button id="saveButton" class="btn btn-loklak-blue" ng-click="saveDataSource(item); " ng-show="item.editing">Save</button>
						<button id="editButton" class="btn btn-loklak-blue" ng-click="toggleEditDataSource($event, item); ">Edit</button>
						<button class="btn btn-danger" ng-click="openConfirmUnsubcribeModal(item)">Unsubscribe</button>
					</div>
				</div>
			</div>
		</li>
		</ul><div id="single-data-map"></div>
	<div add-connection-modal></div>
	<div map-view-modal></div>
	<button id="open-confirm-modal" class="hide" data-toggle="modal" data-target="#confirm-unsubscribe-modal">Hide me!</button>
	<div id="message-view-modal" class="modal fade" role="dialog">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal">&times;</button>
					<h4><a ng-href="{{selectedProfile.source_url}}" target="_blank">{{selectedProfile.source_url}}</a></h4>
				</div>
				<div class="modal-body">
					<div ng-repeat="value in selectedMessages">
						<div single-imported-status data="value" profile="selectedProfile"></div>
						<hr/>
					</div>
				</div>
			</div>
		</div>
	</div>
	<div id="confirm-unsubscribe-modal" class="modal" role="dialog">
		<div id="confirm-unsubscribe-modal-dialog" class="modal-dialog">
			<div class="modal-content" id="add-connection-modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>
				<div class="modal-body">
					<h4 style="text-align : center">Are you sure you want to unsubscribe this ?</h4>
				</div>
				<div class="modal-footer">
					<button id="confirmDeleteButton" class="btn btn-danger" ng-click="unsubscribeDataSource();" data-dismiss="modal">Unsubscribe</button>
					<button id="cancelDeleteButton" class="btn btn-default" data-dismiss="modal">Cancel</button>
				</div>
			</div>
		</div>
	</div>
	</div>
	<!-- Search box for anonymous user-no-followers -->
	<div ng-include src="'anonymous-session-content.html'"></div>
	<!-- End search box for anonymous users -->
</div>